<?php 
$form=$this->beginWidget('CActiveForm', array(
	'id'=>'circle-form',
	'enableAjaxValidation'=> true
)); ?>
    <div class="span2 bs-docs-sidebar">
        <ul class="nav nav-list bs-docs-sidenav affix" id="scrollspy">
            <li><a href="#circle_info"><i class="icon-chevron-right"></i> Thông tin nhóm liên hệ</a></li>
            <?php if(!$model->isNewRecord): ?>
            <li><a href="#contact_list"><i class="icon-chevron-right"></i> Thêm liên hệ</a></li>
            <?php endif; ?>
        </ul>
    </div>

    <div class="span10">
        <div class="well well-large">
            <form class="form-horizontal">
                <fieldset>
                    <legend id="circle_info">Thông tin nhóm liên hệ</legend>
                    <div class="control-group">
                        <?php echo $form->label($model,'name',array('class' => 'control-label')); ?>
                        <div class="controls">
                            <?php echo $form->textField($model,'name', array('placeholder' => 'Tên nhóm liên hệ','title' => 'Điền địa chỉ email liên hệ', 'class' => 'span8'));?>
                            <?php echo $form->error($model,'name',array('inputContainer' => 'span','errorCssClass' => 'errorMsg')) ?>
                        </div>
                    </div>
                    <div class="control-group">
                        <?php echo $form->label($model,'description',array('class' => 'control-label')); ?>
                        <div class="controls">
                            <?php echo $form->textField($model,'description', array('placeholder' => 'Mô tả','title' => 'Thông tin mô tả đến chức năng của nhóm liên hệ', 'class' => 'span8'));?>
                            <?php echo $form->error($model,'description',array('inputContainer' => 'span','errorCssClass' => 'errorMsg')) ?>
                        </div>
                    </div>

                    <?php if(!$model->isNewRecord):?>
                        <legend id="contact_list">Quản lý liên hệ</legend>
                        <div class="control-group">
                            <div class="controls form-inline">
                                <input type="text" id="txt_name_contact" placeholder="nhập tên liên hệ" class="span4"  autocomplete="off">
                                <span class="btn btn-primary" id="add_contact_to_circle" onclick="addToContactList($('#txt_name_contact').val())">Thêm</span>
                                <span class="btn btn-success" id="add_from_list">Xem tất cả liên hệ</span>
                                <span class="btn btn-info" id="import_from_circles">Nhập từ nhóm liên hệ khác</span>
                            </div>
                        <div class="control-group">
                            <?php $this->widget('zii.widgets.grid.CGridView', array(
                                'id'=>'cirle-contact-grid',
                                'dataProvider'=>$contact->searchInCircle($model->id),
                                'filter'=> $contact,
                                'columns'=>array(
                                    array(
                                        'header' => '#',
                                        'value'  => '$this->grid->dataProvider->pagination->currentPage * $this->grid->dataProvider->pagination->pageSize + ($row+1)',
                                        'htmlOptions' => array(
                                            'style' => 'width:25px;text-align:center'
                                        )
                                    ),
                                    'email',
                                    'full_name',
                                    'phone',
                                    'status',
                                    'unsubcribe',
                                    array(
                                        'class'=>'CButtonColumn',
                                    ),
                                ),
                            )); ?>
                        </div>                    
                    <?php endif; ?>
                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">Lưu</button>
                        <button type="button" class="btn">Hủy</button>
                    </div>
                </fieldset>
            </form>
        </div>
    </div>

<?php $this->endWidget(); ?>
<script>
	$(function(){
		$('body').attr('data-spy','scroll');
		$('body').attr('data-target','#scrollspy');
        $('#txt_name_contact').typeahead({
            source: function(keyword, process){
                var result = [];
                map = {};
                circle_id = <?php echo $model->id;?>;
                $.ajax({
                    type:"POST",
                    url: HaiAuMail.baseUrl + "/contact/search/s/" + keyword + "/except_circle/" + circle_id,
                    dataType:'json',
                    async: false,
                    success: function(data){
                        $.each(data, function(i, v){
                            map[v.fullContact] = v;
                            result.push(v.fullContact);
                        });
                    }
                });
                process(result);
            },
            updater: function(item){
                var contact = map[item];
                // contact_id = null;
                // if(contact.hasOwnProperty('id') && contact_id != ""){
                //     contact_id = contact.id;
                // }
                // $("<input/>",{id: 'temp_contact_id', value: contact_id});
                // addToContactList(contact_id, item);
                return contact.email;
            }
        })
	});

    function addToContactList(email){
        email = email.trim();
        circle_id = <?php echo $model->id;?>;
        $.ajax({
            type:"POST",
            url: HaiAuMail.baseUrl + "/contact/addToCircle/email/" + email + "/circle_id/" + circle_id,
            dataType: "JSON",
            success: function(data){
                if(Boolean(data.success) === true){
                    $.fn.yiiGridView.update("cirle-contact-grid");
                }else{
                    
                }
            }
        });
        $("#txt_name_contact").val("");
    }
</script>